@import "../common/common";

.home_page{
   width: $_750;
   height: 100%;
   margin: auto auto $_86 auto;
}

.teacher_list{
  padding-top: $_20;
  padding-bottom: $_2;

  .teacher_list_li{
    background-color: #fff;
    margin: $_10 0;
    border-top: 1px solid #ececec;
    border-bottom: 1px solid #ececec;

    a{
      display: block;
      padding: $_16;
      height: 100%;
      width: 100%;
      position: relative;
    }

    .teacher_content{
      display: block;
      overflow: hidden;
    }
  }

  .have_number{
    position: absolute;
    right: 0;
    top: 0;
    width: $_80;
    height: $_80;
    text-align: right;
    padding-left: $_16;
    padding-top: $_10;
    color: #fff;
    font-size: $_24;
    background: -o-linear-gradient(45deg,transparent 50%,$color-yellow 50%);
    background: -moz-linear-gradient(45deg,transparent 50%,$color-yellow 50%);
    background: -webkit-linear-gradient(45deg,transparent 50%,$color-yellow 50%);
    background: linear-gradient(45deg,transparent 50%,$color-green 50%);
  }

  .teacher_avatar{
    float: left;
    height: $_196;
    width: $_160;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .teacher_detail{
    float: left;
    margin-left:$_26 ;
    width: $_518;
  }

  //左边信息
  .left_box{
    padding: $_14 0;
    padding-top: $_8;

    // 教师基本信息
    .main_info{
       width: $_430;
      .teacher_base_info{
        margin-bottom: $_20;
      }

      .industy_info{
        font-size: $_22;
        color: #999999;

        li{
          margin-bottom: $_20;
        }
      }
    }

    .teacher_name{
      font-size: $_28;
      font-weight: bold;
      color: #58666e;
      line-height: $_30;
    }

    .teacher_position{
      line-height: $_30;
      margin-left: $_20;
      color: #999;

      .teacher_position_name{
        max-width: $_300;
      }
      .is_charge{
        display: block;
        color: #fff;
        font-size: $_18;
        padding: 0 $_6;
        border-radius: $_4;
        margin-left: $_10;
        background: $color-yellow;
      }

    }


    //咨询部分
    .chart_online{
      width: $_136;
      .remain_num{
        color: #999999;

        div{
          margin-top: $_15;
          font-size: $_20;
          text-align: right;

          span{
            color: $color-green;
            margin-left: $_10;
          }
        }
      }

      a{
        display: block;
        padding: $_16 $_20;
        background: $color-yellow;
        border-radius: $_5;
        color: #FFFFFF;
        line-height: $_30;
      }
    }

  }


  //技能部分
  .teacher_skills{
    //border-top: 1px solid #f1f1f1;
    padding: $_14 0 0 0;


    .type_name{
      line-height: $_28;
    }

    .skills_list{
      width:100%;
      color: #666;
      display: flex;
      flex-flow: row;
      flex-wrap:wrap;

      .list{
        float: left;
        margin-right: $_12;
        display: block;
        line-height: $_30;
        border: 1px solid $color-bule;
        color: $color-bule;
        padding: 0 $_10;
        border-radius: $_6;
        font-size: $_20;
        margin-bottom: $_10;
      }
    }
  }

}

.become_to{
  width: $_750;
  text-align: center;
  position: fixed;
  bottom: 0;
  a{
    display: block;
    width: 100%;
    height: $_80;
    line-height: $_80;
    background: $color-green;
    color: #FFFFFF;
    font-size: $_30;
  }
}
